<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>王进喜 - 黑龙江历史名人</title>
    <link rel="stylesheet" href="D:\web1\travel\css\base.css" type="text/css" media="all">
    <link rel="stylesheet" href="D:\web1\travel\css\history.css" type="text/css" media="all">
    <link rel="stylesheet" href="D:\web1\travel\css\history-figures.css" type="text/css" media="all">
    <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
</head>
<body>
    <div class="main">
        <!-- 顶部导航 -->
        <div class="top-bar">
            <div class="search-box">
                <form action="D:\web1\travel\html\search.html" method="get">
                    <input type="text" name="keyword" placeholder="搜索历史事件、人物...">
                    <button type="submit"><i class="fa fa-search"></i></button>
                </form>
            </div>
            
            <ul class="top-nav">
                <li><a href="D:\web1\travel\html\login.html"><i class="fa fa-user-circle"></i> 登录</a></li>
                <li><a href="D:\web1\travel\html\register.html"><i class="fa fa-user-plus"></i> 注册</a></li>
                <li><a href="D:\web1\travel\html\about.html"><i class="fa fa-info-circle"></i> 关于我们</a></li>li>
            </ul>
        </div>

        <!-- 主导航菜单 -->
        <div class="main-menu">
            <ul>
                <li><a href="D:\web1\travel\html\index.html">首页</a></li>
                <li><a href="D:\web1\travel\html\history.html">历史沿革</a></li>
                <li><a href="D:\web1\travel\html\geography.html">地理位置</a></li>
                <li><a href="D:\web1\travel\html\culture.html">风俗文化</a></li>
                <li><a href="D:\web1\travel\html\attractions.html">景点选择</a></li>
                <li><a href="D:\web1\travel\html\products.html">名优特产</a></li>
                <li><a href="D:\web1\travel\html\message.html">在线留言</a></li>
            </ul>
        </div>

        <!-- 人物详情内容 -->
        <div class="figure-page">
            <div class="figure-container">
                <div class="figure-header">
                    <h1>王进喜</h1>
                    <div class="period">1923年－1970年 | 铁人、全国劳动模范</div>
                </div>
                
                <div class="figure-content">
                    <div class="figure-image">
                        <img src="D:\img\img42.jpg" alt="王进喜（铁人）工作照">
                    </div>
                    
                    <div class="figure-details">
                        <h2>人物简介</h2>
                        <p>王进喜，甘肃玉门人，被誉为"铁人"，是新中国石油工业的杰出代表。1960年，他率领1205钻井队来到大庆参加石油会战，为中国石油工业的发展做出了卓越贡献。</p>
                        <p>在极端艰苦的条件下，王进喜带领队伍克服重重困难，创造了一个又一个钻井奇迹。他提出的"三老四严"（对待工作要当老实人、说老实话、做老实事；对待工作要有严格的要求、严密的组织、严肃的态度、严明的纪律）成为中国石油工人的工作准则。</p>
                        
                        <div class="achievements">
                            <h3>主要事迹</h3>
                            <ul>
                                <li>带领1205钻井队创造了当时世界钻井速度的新纪录</li>
                                <li>在钻井设备发生故障时，不顾严寒跳进泥浆池用身体搅拌泥浆，防止井喷</li>
                                <li>参与建设大庆油田，为中国实现石油自给做出重要贡献</li>
                                <li>提出"石油工人一声吼，地球也要抖三抖"的豪言壮语，激励了一代石油人</li>
                                <li>当选为第三届全国人大代表，多次受到党和国家领导人接见</li>
                            </ul>
                        </div>
                        
                        <h2>铁人精神</h2>
                        <p>王进喜所体现的"铁人精神"——爱国主义精神、忘我拼搏精神、艰苦奋斗精神、无私奉献精神，成为中华民族宝贵的精神财富。即使在今天，这种精神仍然激励着人们在各行各业中努力奋斗。</p>
                        <p>大庆市建有铁人王进喜纪念馆，馆内展示了他的生平事迹和精神遗产，成为传承和弘扬铁人精神的重要基地。王进喜的事迹和精神也被写入教科书，影响着一代又一代人。</p>
                        
                        <a href="D:\web1\travel\html\history.html" class="back-link"><i class="fa fa-arrow-left"></i> 返回历史沿革</a>
                    </div>
                </div>
            </div>
        </div>

        <!-- 页脚 -->
        <div class="end">
            <p>©  黑龙江旅游网 - 版权所有</p>
            <p>联系电话：400-123-4567</p>
        </div>
    </div>

    <script>
        // 页面加载完成后的动画效果
        document.addEventListener('DOMContentLoaded', function() {
            // 为导航项添加active状态
            const navItems = document.querySelectorAll('.main-menu a');
            navItems.forEach(item => {
                if (item.classList.contains('active')) {
                    item.style.color = '#CCFF66';
                    item.style.backgroundColor = '#154a33';
                }
                
                // 添加导航hover效果
                item.addEventListener('mouseover', function() {
                    if (!this.classList.contains('active')) {
                        this.style.backgroundColor = 'rgba(21, 74, 51, 0.7)';
                        this.style.transform = 'scale(1.05)';
                    }
                });
                
                item.addEventListener('mouseout', function() {
                    if (!this.classList.contains('active')) {
                        this.style.backgroundColor = '';
                        this.style.transform = 'scale(1)';
                    }
                });
            });
            
            // 图片加载动画
            const figureImage = document.querySelector('.figure-image img');
            figureImage.style.opacity = '0';
            figureImage.style.transition = 'opacity 1s ease';
            
            figureImage.onload = function() {
                this.style.opacity = '1';
            };
            
            // 如果图片已经缓存
            if (figureImage.complete) {
                figureImage.style.opacity = '1';
            }
        });
    </script>
</body>
</html>
